import {Button} from "./button";
import {Object} from "./object";

export class UIManager extends Object {
    constructor(canvas, ctx) {
        super(canvas);
        this.list = [];
        this.currentLayer = {};
        this.canvas = canvas;
        this.ctx = ctx;
        this.width = 50;
        this.height = canvas.height - 20;
        this.top = 10;
        this.left = 10;
        this.list.push(new Button(this, this.left, this.top))

    }

    setCanvas(canvas) {
        this.canvas = canvas;
        this.width = 50;
        this.height = canvas.height - 20;
        this.top = 10;
        this.left = 10;
    }

    draw(canvas) {
        this.setCanvas(canvas);
        this.ctx.beginPath();
        //绘制工具栏 外边框
        this.ctx.strokeStyle = "#8ae2ce";
        this.ctx.strokeRect(this.left, this.top, this.width, this.height);

        // console.log('draw', this.left)
        //绘制工具栏文字
        this.ctx.fillStyle = "#e21b1b";
        this.ctx.textAlign = "center";
        this.ctx.textBaseline = "middle";
        this.ctx.font = '16px Microsoft YaHei';
        this.ctx.strokeStyle = "#09f0bd";
        this.ctx.fillText("layer1", this.left + this.width / 2, this.top + this.height / 2);
        // this.ctx.fillText("layer2", x + 5, 15 + 12 + 24, 100);
        // //绘制工具栏中间的线条
        // this.ctx.moveTo(x, 15 + 24);
        // this.ctx.lineTo(x + 180, 15 + 24);
        // this.ctx.moveTo(x, 15 + 24 + 24);
        // this.ctx.lineTo(x + 180, 15 + 24 + 24);
        this.ctx.stroke()
    }
}
